import TextWidget from './text-widget.js'
import {WIDGET_TYPE} from './widget-const.js';

const _template = Object.freeze([
    {"state": -1, "caption": "fix bug #1135"},
    {"state": -1, "caption": "fix bug #1177"},
    {"state": 0, "caption": "add RoadMap to SLOG"},
    {"state": 1, "caption": "meeting ID:116337 at 3:00PM"}
]);

function _GetHTMLText(caption, state) {
    return `<div class="form-check">
  <input class="form-check-input" type="checkbox" ${state > 0 ? 'checked' : ''}>
  <label class="form-check-label">${caption}</label>
</div>`;
}

export default class TODOWidget extends TextWidget {
    constructor(sectionData, dispatcher) {
        super(sectionData, dispatcher);
        try {
            this._data = JSON.stringify(this._sectionData.content ?? _template, null, 4);
        } catch (e) {
            this._data = JSON.stringify(_template, null, 4);
            console.error(e);
        }
    }
    get sectionData() {
        this._sectionData.type = WIDGET_TYPE.TODO;
        this._sectionData.content = JSON.parse(this._data);
        return this._sectionData;
    }
    get language() {return 'json';}
    get textareaText() {return this._data;}
    set textareaText(value) {this._data = value;}
    Init() {
        super.Init();
        this._viewContainerElem.classList.add("scroll", "scroll-horizontal");
        this._editContainerElem.setAttribute('data-language', 'todo');
        return this;
    }
    _UpdateView() {
        try {
            const _data = JSON.parse(this._data);
            let _HTMLText = '';
            for (let i = 0, N = _data.length; i < N; ++i) {
                _HTMLText += _GetHTMLText(_data[i].caption, _data[i].state);
            }
            this._viewContainerElem.innerHTML = _HTMLText;
        } catch (e) {
            this._viewContainerElem.innerText = e.message;
            console.log(e.stack);
        }
    }
};

